<template>
	<view class="contont">
		<nav-bar :title="reacDatas.title" :iconLeft="true" />
		<view class="step">
			<up-tabs :list="actDatas.tab_list" lineWidth="25" @change="tab_change" :scrollable="false" />
		</view>
		<view class="step_zhanwei" />
		<view v-show="reacDatas.step_active == 1">
			<view class="content-bgc">
				<view class="b-con">
					<up-cell-group :border="false">
						<up-cell title="主视图">
							<template #value>
								<view class="cell-text" style="width: 70%;">
									<uni-file-picker v-model="reacDatas.imageValue" return-type="object"
										:del-icon="false"></uni-file-picker>
								</view>
							</template>
						</up-cell>
						<up-cell title="产品编号">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.code }} </view>
							</template>
						</up-cell>
						<up-cell title="产品名称">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.name }} </view>
							</template>
						</up-cell>
						<up-cell title="货品分类">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.classify_name }}</view>
							</template>
						</up-cell>
						<up-cell title="基本单位（小单位）">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_main }}</view>
							</template>
						</up-cell>
						<up-cell title="基本单位销售单价(元)">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_main_price }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位1">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_one }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位1与基本单位对应比例">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_one_ratio }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位1销售单价(元)">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_one_price }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位2">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_two }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位2与副单位1对应比例">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_two_ratio }}</view>
							</template>
						</up-cell>
						<up-cell title="副单位2销售单价(元)">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_two_price }}</view>
							</template>
						</up-cell>
						<up-cell title="产品规格">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.royalties }}</view>
							</template>
						</up-cell>
						<up-cell title="销售提成(%)">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.unit_assist_two_price }}%</view>
							</template>
						</up-cell>
						<up-cell title="库存预警阈值">
							<template #value>
								<view class="cell-text">{{ reacDatas.detail_record.threshold }}</view>
							</template>
						</up-cell>
						<up-cell title="备注">
							<template #value>
								<view class="cell-text" style="width: 70%;">{{ reacDatas.detail_record.desc }}</view>
							</template>
						</up-cell>
					</up-cell-group>
				</view>
			</view>
		</view>
		<view v-show="reacDatas.step_active == 2">
			<uni-card v-for="(item, index) in reacDatas.process_list" :key="index" :title="item.name" margin="8px"
				spacing="0">
				<view class="con">
					<view class="ctent">单次工价(元)：{{ item.price }}</view>
					<view class="ctent">单次完成时间(秒)：{{ item.finish_m }}</view>
				</view>
				<view class="con" style="align-items: normal;">
					<view class="ctent" style="flex: none;">工序要求：</view>
					<view class="ctent">{{ item.require }}</view>
				</view>
				<view class="con" style="align-items: normal;">
					<view class="ctent" style="flex: none;">备注：</view>
					<view class="ctent">{{ item.desc }}</view>
				</view>
			</uni-card>
		</view>
		<view v-show="reacDatas.step_active == 3">
			<uni-card v-for="(item, index) in reacDatas.bom_list" :key="index" :title="item.name" margin="8px" spacing="0">
				<view class="con">
					<view class="ctent">规格：{{ item.specification }}</view>
					<view class="ctent">基本单位：{{ item.unit_main }}</view>
				</view>
				<view class="con">
					<view class="ctent">用量：{{ item.num }}</view>
					<view class="ctent">采购单价：{{ item.unit_main_price }}</view>
				</view>
			</uni-card>
		</view>
	</view>
</template>
<script setup>
import daProductApi from '../../../api/dataa/da_product'
import { reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
onLoad((option) => {
	get_detail(option.id);
})

const reacDatas = reactive({
	detail_record: {},
	process_list: [],
	bom_list: [],
	imageValue: {},
	title: '产品管理详情',
	step_active: 1
})
const actDatas = {
	tab_list: [
		{
			name: '基本资料',
			status: 1
		}, {
			name: '工序配置',
			status: 2
		}, {
			name: 'BOM配置',
			status: 3
		}]
}
function tab_change(v) {
	reacDatas.step_active = v.status
};
function get_detail(id) {
	daProductApi.product_detail(id).then(res => {
		reacDatas.detail_record = res
		reacDatas.process_list = JSON.parse(res.process_info).process_info
		reacDatas.bom_list = JSON.parse(res.bom_info).bom_info
		reacDatas.imageValue = {
			name: 'file.txt',
			extname: "txt",
			url: res.file_url,
		}
	})
};
</script>

<style lang="scss">
.step {
	width: 100%;
	background-color: #fff;
	position: fixed;
	z-index: 10;
	border-bottom: 1px solid #dadbde;
}

.step_zhanwei {
	height: 44px;
}

.padEVN {
	padding-bottom: env(safe-area-inset-bottom)
}
</style>